<html>
<head>
    <meta charset="utf-8" />
    <!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>x6 Stencil Example</title>
  <script src="https://unpkg.com/x6/dist/x6.js"></script>
  <link rel="stylesheet" href="https://unpkg.com/x6/dist/x6.css">
</head>
<body>
  <div id="graph-container"></div>
  <script>
    // 创建Graph实例
const graph = new x6.Graph({
  container: document.getElementById('graph-container'),
  width: 800,
  height: 600,
  grid: true
});
 
// 创建Stencil实例
const stencil = new x6.Stencil({
  title: 'Stencil',
  target: graph,
  columns: 4,
  width: 200,
  height: 240
});
 
// 将Stencil添加到页面上的某个容器中
stencil.container.appendChild(document.body);
 
// 这里可以添加节点到Stencil中
// 例如：stencil.load([...])
  </script>
</body>
</html>
